<template>
    <div class="page" data-page="inspectionApply" style="z-index: 2;">
        <div class="navbar">
            <div class="navbar-inner">
                <div class="left">
                    <a href="#" class="link back" @click="$root.backToTab()">
                        <i class="icon icon-back"></i>
                        <span class="ios-only">Back</span>
                    </a>
                </div>
                <div class="title sliding" style="left: -25px;">查岗记录列表</div>
            </div>
        </div>
        <div data-infinite-distance="50" class="page-content infinite-scroll-content" @infinite="loadMoreRecordList">
            <div class="list mtop no-hairline-bottom">
                <ul id="RDPersonOnDuty">

                </ul><!--值班人员-->
            </div>
            <div id="record-preloader" style="display: none" class="preloader infinite-scroll-preloader"></div>
        </div>
    </div>
</template>
<style scoped>
    .mtop {
        margin: 0px;
    }

    .textsize {
        font-size: 15px;
        color: #333333;
    }

    .subtextsize {
        font-size: 13px;
        color: #666;
    }

    .timesize {
        font-size: 13px;
        color: #666;
    }

</style>

<script>
    return {
        data: function () {
            return {
                pageIndex: 0,//当前页数
                pageSize: 25,//一页包含数量
                isMore:false,
            }
        },
        mounted() {
            var self = this;
            self.getgetRecordData();

        },

        methods: {

            loadMoreRecordList:function() {
                if (this.isMore) {
                   this.pageIndex++;
                   this.getgetRecordData();
                }
            },

            getgetRecordData: function () {
                var self = this;
                Dao.getRecordList({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    orgIds: userInfor.organizationIds,
                    pageIndex: self.pageIndex,
                    pageSize: self.pageSize,
                }, function (data) {
                    if (data&&data.length > 0){
                        if (data.length == self.pageSize) {
                            $("#record-preloader").show();
                            self.isMore = true;
                        } else {
                            $("#record-preloader").hide();
                            self.isMore = false;
                        }
                        for (var i = 0; i < data.length; i++) {
                            $("#RDPersonOnDuty").append(`
                            <li>
                                <a href="/recordingZhagangDetails/` + data[i].id + `/` + common.transNullundefined(data[i].tasksName) + `/" class="item-content">
                                <div class="item-inner">
                                <div class="item-title">
                                        <div class="item-title textsize">` + common.transNullundefined(data[i].tasksName) + `</div>
                                        <div class="item-subtitle subtextsize">在岗 ` + data[i].onGuard.toString() + `  离岗 ` + data[i].absences.toString() + `  漏岗 ` + data[i].leaking.toString() + `</div>
                                 </div>
                                        <div class="item-subtitle timesize">` + common.transNullundefined(data[i].initiateTime) + `</div>
                                </div>
                                </a>
                             </li>`)
                        }
                    } else {
                        $("#record-preloader").hide();
                        self.isMap = false;
                        if (self.pageIndex == 0) {
                            $("#RDPersonOnDuty").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>
                                                  `);
                        }
                    }

                });
            },
        }
    }
</script>